<template>
	<view class="jnpf-wrap jnpf-wrap-workflow">
		<u-form :model="dataForm" ref="dataForm" :errorType="['toast']" label-position="left" label-width="200"
			label-align="left">
			<u-form-item label="还款单号" v-if="judgeShow('tl002')">
				<u-input v-model="dataForm.tl002" disabled placeholder="提交保存后系统自动生成"></u-input>
			</u-form-item>
			<u-form-item label="人员" v-if="judgeShow('tl003')">
				<jnpf-user-select v-model="dataForm.tl003" @input="changeName" />
			</u-form-item>
			<u-form-item label="部门" v-if="judgeShow('tl004')">
				{{dataForm.tl009}}
			</u-form-item>

			<u-form-item label="还款金额合计" v-if="judgeShow('tl005')">
				<u-input v-model="dataForm.tl005" disabled></u-input>
			</u-form-item>
			<u-form-item label="还款日期" v-if="judgeShow('tl006')">
				<lys-date v-if="showtl006" type="1" @cancleTime="showtl006 = false"
					@submitTime="submittl006"></lys-date>
				<view style="display: flex;justify-content: space-between;width: 100%;">
					<view>
						{{dataForm.tl006}}
					</view>
					<view>
						<u-icon name="arrow-down-fill" color='#ccc' @click="showtl006=true"></u-icon>
					</view>
				</view>
			</u-form-item>
			<u-form-item label="备注" v-if="judgeShow('tl007')">
				<u-input v-model="dataForm.tl007"></u-input>
			</u-form-item>
			<u-form-item label="附件" type="textarea" v-if="judgeShow('tl008')">
				<jnpf-file v-model="dataForm.tl008" />
			</u-form-item>
			<view class="jnpf-table" style="margin-top: 24rpx">
				<view class="jnpf-table-item" style="margin-bottom: 24rpx"
					v-for="(item, index) in dataForm.tableField109">
					<u-form-item label="序号" style="background-color: aqua">
						{{ index + 1 }}
					</u-form-item>
					<u-form-item label="借款单号" v-if="judgeShow('tableField109-tn003')">
						<view style="display: flex;justify-content: space-between;width: 100%;">
							<view>
								{{item.tn003}}
							</view>
							<view>
								<u-icon name="arrow-down-fill" color='#ccc' @click="chioceOastdBox(index)"></u-icon>
							</view>
						</view>
					</u-form-item>
					<u-form-item label="借款金额" v-if="judgeShow('tableField109-tn004')">
						<u-input v-model="item.tn004" disabled></u-input>
					</u-form-item>
					<u-form-item label="借款日期" v-if="judgeShow('tableField109-tn005')">
						<lys-date v-if="showtn005" type="1" @cancleTime="showtn005 = false"
							@submitTime="submittn005"></lys-date>
						<view style="display: flex;justify-content: space-between;width: 100%;">
							<view>
								{{item.tn005}}
							</view>
							<view>
								<u-icon name="arrow-down-fill" color='#ccc' @click="handleshowtn005(index)"></u-icon>
							</view>
						</view>
					</u-form-item>
					<u-form-item label="姓名" v-if="judgeShow('tableField109-tn006')">
						<jnpf-user-select v-model="item.tn006" />
					</u-form-item>
					<u-form-item label="已还款金额" v-if="judgeShow('tableField109-tn008')">
						<u-input v-model="item.tn008" disabled></u-input>
					</u-form-item>
					<u-form-item label="还款金额" v-if="judgeShow('tableField109-tn009')">
						<u-input v-model="item.tn009"></u-input>
					</u-form-item>
					<u-form-item label="备注" v-if="judgeShow('tableField109-tn007')">
						<u-input v-model="item.tn007"></u-input>
					</u-form-item>
					<u-button type="error" plain :ripple="true" @click="delPlan(index)">删除</u-button>
				</view>
			</view>
			<u-button type="primary" @click="addHandleOastfEntityList()"
				v-if="!setting.readonly && !judgeWrite('tableField109')">新增</u-button>
		</u-form>
		<u-toast ref="uToast" />
		<u-popup v-model="popupshow" mode="bottom" height="50vh">
			<view class="content">
				<scroll-view :scroll-y="true" :scroll-x="true"
					style="height: 800rpx; white-space: nowrap;overflow-x: auto;">
					<zsf-table :radio='true' @getRow='getSelectData' ref="product" :title='productionQueueTitle'
						:data="tableList"></zsf-table>
				</scroll-view>
				<view class="confrim-btn">
					<u-button @click="close">确定</u-button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import comMixin from "../mixin";
	import {
		getGoodsList,
		getCustomerList,
		Info,

	} from "@/api/apply/order";
	import {
		postOastl,
		putOaste,
		BomcbListInit,
		getOastlBudgetNo,
		getOastdboxList
	} from "@/api/workFlow/flowBefore";
	import {
		getDictionaryDataSelector,
		getDataInterfaceDataInfo,
		getUserAll
	} from "@/api/common";
	import {
		UserSettingInfo
	} from "@/api/user"
	export default {
		mixins: [comMixin],
		watch: {
			'dataForm.tableField109': {
				handler(newVal) {
					let total = 0;
					console.log('newVal', newVal);
					newVal.forEach(item => {
						if (item.tn009) {
							total += parseFloat(item.tn009);
						}
					});
					this.dataForm.tl005 = total;
				},
				deep: true // 深度监听数组内部的变化
			}
		},
		data() {
			return {
				show: false,
				popupshow: false,
				showtf003: false,
				showtl006: false,
				showtn005: false,
				showte008: false,
				showte009: false,
				productionQueueTitle: [{
						title: "序号",
						key: "sid",
						width: '80',
					},
					{
						title: "借款单号",
						key: "ti002",
						width: '80',
					},
					{
						title: "借款金颔",
						key: "ti004",
						width: '80',
					},
					{
						title: "借款日期",
						key: "ti005",
						width: '80',
					},
					{
						title: "收款人",
						key: "ti008Name",
						width: '80',
					},

				],
				dataForm: {
					tl003: '',
					tl002: '',
					tl006: '',
					tl007: "",
					tl008: [],
					tl004: null,
					tl005: 0,
					tl009: null,
					tableField109: [],
					flowId: null,
					flowState: 0 //提交0 保存1
				},
				setting: {},
				id: "",
				tableList: [],
				tk003: '',
				tk003Name: '',
				tl004Id: null,
				index: '',
				lastItemId: '',
				lastItemName: '',
				List: [],
				index: null,
			};
		},
		methods: {
			handleshowtn005(index) {
				this.index = index;
				this.showtn005 = true;
			},
			getUserInfo() {
				UserSettingInfo().then((res) => {
					this.dataForm.tl003 = res.data.id; //用户
					this.tl004Id = res.data.id; //用户
					this.dataForm.tl004 = res.data.organizeId; //部门
					this.dataForm.tl009 = res.data.department; //部门名称
				})
			},
			changeName(id) {
				getUserAll().then(res => {
					let item = res.data.filter(o => o.id === id)[0]
					this.tl004Id = item.id
					this.dataForm.tl004 = item.departmentId; //部门编号
					this.dataForm.tl009 = item.department; //部门名称
				})
			},

			judgeRequired(id) {
				if (!this.formOperates || !this.formOperates.length) return false;
				let arr = this.formOperates.filter((o) => o.id === id) || [];
				if (!arr.length) return false;
				let item = arr[0];
				return item.required;
			},
			judgeShow(id) {
				if (!this.setting.formOperates || !this.setting.formOperates.length)
					return true;
				let arr = this.setting.formOperates.filter((o) => o.id === id) || [];
				if (!arr.length) return true;
				let item = arr[0];
				return item.read;
			},
			judgeWrite(id) {
				if (!this.setting.formOperates || !this.setting.formOperates.length)
					return false;
				let arr = this.setting.formOperates.filter((o) => o.id === id) || [];
				if (!arr.length) return true;
				let item = arr[0];
				return !item.write;
			},
			submittl006(time, type, timeInt) {
				let tl006 = time.split("-");
				this.dataForm.tl006 = tl006[0] + tl006[1] + tl006[2]
				this.showtl006 = false;
			},
			submittn005(time, type, timeInt) {
				let tn005 = time.split("-");
				this.dataForm.tableField109[this.index].tn005 = tn005[0] + tn005[1] + tn005[2]
				this.showtn005 = false;
			},
			submitte008(time, type, timeInt) {
				this.dataForm.te008 = time
				this.showte008 = false;
			},
			submitte009(time, type, timeInt) {
				this.dataForm.te009 = time
				this.showte009 = false;
			},
			submittf003(time, type, timeInt) {
				this.dataForm.tableField109[this.index].tf003 = time
				this.showtf003 = false;
			},

			Showtf003(index) {
				this.index = index;
				this.showtf003 = true;
			},
			getSelectData(e) {
				console.log('e.data', e.data);
				this.List = [{
					...e.data
				}]
			},
			// 删除
			delPlan(index) {
				uni.showModal({
					title: "提示",
					content: "您确定要删除当前数据吗？",
					success: (res) => {
						if (res.confirm) {
							this.dataForm.tableField109.splice(index, 1);
							this.$u.toast(`删除了第${index+1}条`);
						}
					},
				});
			},
			// 如果打开一个的时候，不需要关闭其他，则无需实现本方法
			open(index) {
				// 先将正在被操作的swipeAction标记为打开状态，否则由于props的特性限制，
				// 原本为'false'，再次设置为'false'会无效
				this.dataForm.tableField109[index].show = true;
				this.dataForm.tableField109.map((val, idx) => {
					if (index != idx) this.dataForm.tableField109[idx].show = false;
				})
			},
			close() {
				this.popupshow = false;
				this.dataForm.tableField109.splice(this.index, 1);
				for (let i = 0; i < this.List.length; i++) {
					const e = this.List[i];
					let item = {
						tn003: e.ti002, //借款单号
						tn004: e.ti004, //借款金额
						tn005: e.ti005, //借款日期
						tn006: e.ti008, //姓名
						tn008: e.ti010, //已还款金额
						tn009: parseFloat(e.ti004 || 0) - parseFloat(e.ti010 || 0),
					};
					this.dataForm.tableField109.push(item);
					console.log('this.dataForm.tableField109', this.dataForm.tableField109);
				}
			},
			hangledepData(data) {
				if (data) {
					let length = data.ids[0].length
					let ids = data.ids[0]
					let str = data.name[0];
					let parts = str.split('/');
					// 检查数组是否为空，然后安全地获取最后一项
					this.lastItemId = length > 0 ? ids[length - 1] : null;
					this.lastItemName = parts.length === 1 ? parts[0] : parts[parts.length - 1];
				}
			},
			chioceOastdBox(index) {
				if (!this.dataForm.tl004) {
					this.$refs.uToast.show({
						title: '部门不能为空！',
						type: 'error',
					})
					return
				}
				this.index = index; //当前下标
				//报销部门
				var queryParam = {
					ti008: this.tl004Id,
					currentPage: 1,
					pageSize: 500,
					sort: 'asc',
					sidx: 'TI001',
				};
				getOastdboxList(queryParam).then(res => {
					this.popupshow = true
					this.tableList = res.data.list.map((item, index) => {
						return {
							sid: index + 1,
							...item
						}
					})

				})
			},

			addHandleOastfEntityList() {
				let item = {
					tn003: undefined,
					tn004: 0,
					tn005: undefined,
					tn006: undefined,
					tn007: undefined,
					tn008: 0,
					tn009: 0,
				};
				if (!this.dataForm.tl003) {
					this.$refs.uToast.show({
						title: '人员不能为空！',
						type: 'error',
					})
					return
				}
				this.dataForm.tableField109.push(item);
			},
			getInfoFn(data) {
				this.setting = data;
				this.dataForm.flowId = data.flowId
				getOastlBudgetNo().then((res) => {
					if (res.code == 200) {
						this.dataForm.tl006 = this.jnpf.getCurrentDate('YYYYMMDD');
						this.getUserInfo()
					}
				});
			},
			selfSubmit(eventType) {
				for (let i = 0; i < this.dataForm.tableField109.length; i++) {
					const e = this.dataForm.tableField109[i];
					if (
						parseFloat(e.tn009) >
						parseFloat(e.tn004) - parseFloat(e.tn008)
					) {
						return this.$refs.uToast.show({
							title: "[还款金额]不能大于[借款金额-已还款金额]！",
							type: 'error',
						})
					}
					if (parseFloat(e.tn008) > parseFloat(e.tn004)) {
						return this.$refs.uToast.show({
							title: "[已还款金额]不能大于[借款金额]！",
							type: 'error',
						});
					}
				}
				this.dataForm.status = eventType === "submit" ? 0 : 1;
				uni.showModal({
					title: "提示",
					content: "您确定要提交当前流程吗？",
					success: (res) => {
						if (res.confirm) {
							this.HandleSubmit(eventType);
						}
					},
				});
			},
			HandleSubmit(eventType) {
				this.dataForm.flowState = eventType == "submit" ? 0 : 1;
				console.log('this.dataForm', this.dataForm);
				postOastl(this.dataForm).then((res) => {
					uni.showToast({
						title: res.msg,
						complete: () => {
							setTimeout(() => {
								uni.$emit("refresh");
								uni.navigateBack();
							}, 1500);
						},
					});

				});
			},

		},
	};
</script>